<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>伪网站-个人中心</title>
  <link rel="stylesheet" href="../CSS/个人中心.css">
</head>

<body>
  <h1>个人中心
    <p class="p1"><a href="./修改密码.html">修改密码</a></p>
    <p class="p2"><a href="./首页.html">回到首页</a></p>
  </h1>
  <form>
    <label>用户名：<input class="name" type="text" readonly></label>
    <label>年龄：<input class="age" type="text"></label>
    <label>性别：<select name="gender">
        <option value="choose">请选择</option>
        <option value="男">男</option>
        <option value="女">女</option>
      </select></label>
    <label>昵称：<input class="nickname" type="text"></label>
    <button>确认修改</button>
  </form>
</body>
<script src="../axios.min.js"></script>
<script src="../http.js"></script>
<script>
  // 封装一个立即执行函数判断是否登录
  (async function(){
    let r = await isLogin();
    if(r.status != 1){
      location.href = './登录.html';
      return;
  }})();
</script>
<script>
  const form = document.querySelector('form');
  const name = document.querySelector('.name');
  const age = document.querySelector('.age');
  const gender = document.querySelector('select');
  const nickname = document.querySelector('.nickname');
  const button = document.querySelector('button');
  async function fun() {
    let r = await isLogin();
    name.value = r.info.username;
    age.value = r.info.age;
    gender.value = r.info.gender;
    nickname.value = r.info.nickname;
  }
  fun();
  // 封装fun1函数用来修改用户数据
  async function fun1() {
    let r = await isLogin()
    let res = await http.post('/users/update', { id: r.id, age: age.value, gender: gender.value, nickname: nickname.value })
    console.log(res)
    if (res.status === 200) {
      alert('修改数据成功')
      location.href = './首页.html'
    }
    else {
      alert('修改数据失败')
    }
  }

  form.addEventListener('submit',
    async function submit(e) {
      e.preventDefault();
        await fun1();

    }

  )

</script>

</html>